<style lang="scss" scoped>
        .viewDetailed{
          // background: #fff;
          width: 96%;
          height: 100%;
          overflow: auto;
          margin: 0 auto;
          .mainTitle{
              background: #E2ECFA;
              height: 40px;
              border: 1px solid rgba(188, 188, 188, 0.28);
              line-height: 40px;
              padding: 0 10px;
              .imgLeft{
                width: 24px;
                float: left;
                margin-top: 8px;
              }
              p{
                float: left;
                margin-left: 22px;
                font-size: 14px;
                font-weight: 600;
              }
              .imgRight{
                width: 24px;
                float: right;
                font-size: 16px;
                cursor: pointer;
                color: #999999;
              }
            }
        }
        .viewDetailedActive{
          .mainTitle{
            background: #E2F3D8;
          }
          .tableContent{
            background: #F7FBF6;
          }
        }
::v-deep{
    .el-table th.is-leaf, .el-table td{
      border: none;
      background: #F3F7FB;
    }
    .el-table .cell{
      color: #000;
    }
}
.tableContent{
background: #F3F7FB;
border: 1px solid #DCDCDC;
border-top:0px;
}
.topmainTask{
  margin-top: 2%;
}

</style>
<template>
  <div class="viewDetailed" :class="importantActive ? 'viewDetailedActive' : ''">
    <div v-for="i in 9" :key="i" class="mainTask" :class="i !== 1 ? 'topmainTask' : ''">
      <div class="mainTitle">
        <img v-show="!importantActive" class="imgLeft" src="../../assets/img/task.png">
        <img v-show="importantActive" class="imgLeft" src="../../assets/img/task1.png">
        <p>推动落实改革三年行动</p>
      </div>
      <div class="tableContent">
        <el-table
          :data="tableData"
          style="width: 90%;margin:0 auto"
        >
          <el-table-column
            prop="date"
            label="任务名称"
            width="180"
          />
          <el-table-column
            prop="name"
            label="权重(%)"
            width="180"
          />
          <el-table-column
            prop="address"
            label="任务内容"
            :formatter="formatter"
          />
        </el-table>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  components: {

  },
  props: {
    importantActive: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      input: '',
      tableData: [{
        date: '推动落实改革三年行动',
        name: '8',
        address: '围绕全面深化改革重点领域和关键环节，协同推动改革三年行动落实落地，年底前实现任务完成率70%以上。'
      }]
    }
  },
  watch: {
    importantActive(val) {
      console.log(val)
    }
  },
  mounted() {
    console.log('12')
    // this.$nextTick(() => {
    //   this.$refs['filterBank' + (this.filterArr.length - 2)][0].setAllAttribute({
    //     name: 'disabled',
    //     value: true
    //   })
    // })
  },
  methods: {
    formatter(row, column) {
      return row.address
    }
  }

}
</script>
